import React, { memo, useEffect } from "react";
import { Swiper } from "antd-mobile";
import axios from "@/utils/axios";
import style from "./Index.module.scss";
const Index = memo(() => {
  const [images, setImages] = React.useState<string[]>([]);
  async function getbanner() {
    const res = await axios.get("/banner");
    setImages(res.data.data);
  }
  useEffect(() => {
    getbanner();
  }, []);
  const items = images.map((color, index) => (
    <Swiper.Item key={index}>
      <div className={style.vswiperitem}>
        <img src={color} alt="" />
      </div>
    </Swiper.Item>
  ));
  return (
    <div>
      <Swiper loop autoplay>
        {items}
      </Swiper>
    </div>
  );
});

export default Index;
